
.role-view-auth-view {
  
  .auth-tree {
    
    display: flex;
    flex-flow: wrap;
    
    .auth-tree-node-content.auth-tree-node-deep-0 {
      
      height: 32px;
      background: #F5F7F7;
      line-height: 32px;
      
      .el-checkbox {
        display: none;
      }
      
    }
    
  }
  
  & > .auth-tree {
    
    & > .auth-tree-node {
      width: 50%;
      min-width: 50%;
    }
    
  }
}

.role-view-auth-view {
  
  display: flex;
  flex-flow: wrap;
  
  .el-tree {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    
    & > .el-tree-node {
      
      & > .el-tree-node__content {
        
        height: 32px;
        background: #F5F7F7;
        
        .el-checkbox {
          display: none;
        }
        
      }
      
    }
    
  }
  
  .el-tree .el-tree-node__label {
    user-select: none;
  }
  
}

.role-view-auth-view {
  .el-tree-node__children {
    .el-checkbox__input.is-disabled .el-checkbox__inner {
      background-color: #f2f6fc !important;
      border-color: #e0e1e2 !important;
    }
  }
}

.role-auth-view-tree-row {
  display: flex;
  flex: 1;
  padding-right: 18px;
  user-select: none;
  
  &__radio {
    display: flex;
    flex: 1;
    justify-content: flex-end;
    align-items: center;
  }
  
  .el-radio.is-disabled.is-checked {
    
    .el-radio__label {
      color: #c0c4cc !important;
    }
    
    .el-radio__inner {
      opacity: 0.5;
    }
    
    .el-radio__inner::after {
      background-color: #fff;
    }
    
  }
  
}

.role-view-auth-view {
  
  .el-checkbox__input.is-disabled.is-indeterminate,
  .el-checkbox__input.is-disabled.is-checked {
    
    opacity: 0.5;
    
    .el-checkbox__inner {
      background-color: $color-primary !important;
      border-color: $color-primary !important;
    }
    
    .el-checkbox__inner::after {
      border-color: #fff;
    }
    
  }
  
  .el-checkbox__input.is-disabled.is-indeterminate {
    .el-checkbox__inner {
      &::after {
        background-color: #fff !important;
      }
    }
  }
  
  .el-checkbox__input.is-disabled.is-indeterminate {
    .el-checkbox__inner::before {
      background-color: #fff;
      border-color: #fff;
    }
  }
  
}

.role-view-auth-view-finish {
  
  #vueWaterfall {
    display: flex;
  }
  
}

.role-view-auth-view {
  
  #vueWaterfall {
    
    .slot-box + .vue-waterfall-column {
      border-right: 1px solid #E8E8E8;
    }
    
  }
  
  .el-tree {
    & > .el-tree-node {
      & > .el-tree-node__content {
        .role-auth-view-tree-row__name {
          font-weight: bold;
        }
      }
    }
  }
  
}

.role-auth-view-tree-row__name {
  color: $text-color-primary;
  min-width: 120px;
}

.role-auth-view-tree-row__export {
  display: flex;
  justify-self: flex-start;
  min-width: 140px;
  .role-auth-view-tree-row__name {
    min-width: 70px;
  }
}